<template>
<div class="container">
<div class="errorPage">
    <!-- <img src="~assets/images/404bg.gif" alt=""> -->
    <h3 v-if="error.statusCode === 404">页面不存在</h3>
    <h3 v-else>页面发生了一个错误</h3>

    <nuxt-link to="/" class="backHome">返回首页</nuxt-link>
  </div>
</div>
  
</template>
<script>
export default {
  components: {},
  props: ["error"],
  layout: "blog", // 可以为错误页面指定自定义的布局

  data() {
    return {};
  },
  methods: {},
};
</script>

<style scoped lang='scss'>
.errorPage{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: url('~/assets/images/404.png') no-repeat;
  width: 100%;
  min-height: 800px;
background-position: 50% 80px;
}
.backHome{
  width: 180px;height: 46px;border-radius: 46px;background-color: #449bff;;color: #fff;
  text-align: center;line-height: 46px;
  margin-top: 20px;

}
h3{

  margin-top: 280px;
}
</style>